<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
    <title>为青春添彩 有你更精彩</title>
    <link href="css/index.css" rel="stylesheet" type="text/css">
    <script type="text/javascript" src="js/flexible.js"></script>
    <script type="text/javascript" src="https://cdns.51finace.com/js/jquery.min.js"></script>
    <!-- head 中 -->
    <link rel="stylesheet" href="./css/jquery-weui.css">
    <link rel="stylesheet" href="./css/jquery-weui.min.css">
    <!-- <link rel="stylesheet" href="https://cdn.bootcss.com/weui/1.1.3/style/weui.min.css">
    <link rel="stylesheet" href="https://cdn.bootcss.com/jquery-weui/1.2.1/css/jquery-weui.min.css"> -->
    <style>
        html,
        body {
            width: 100vw;
            min-height: 100vh;
            overflow-x: hidden;
        }

        .toolbar .title {
            font-size: 0.42rem !important;
            line-height: 1.4rem !important;
        }

        .toolbar .picker-button {
            font-size: 0.42rem !important;
            height: 1.4rem !important;
            line-height: 1.4rem !important;
        }

        .toolbar .toolbar-inner {
            height: 1.4rem !important;
        }

        .input1 {
            display: none;
        }

        .input1+span {
            display: inline-block;
            width: .39rem;
            height: .39rem;
            border: solid .026667rem #999999;
        }

        .input1:checked+span {
            background: url('./images/10.png')no-repeat;
            background-size: cover;
            width: .39rem;
            height: .39rem;
        }

        label {
            display: flex !important;
            justify-content: space-between !important;
            height: 1.2rem !important;
            padding: 0rem 0.3rem !important;
            font-size: 0.42rem;
            align-items: center;
        }

        textarea::-webkit-input-placeholder {
            font-size: .346667rem;
            color: #d4d4d4;
        }

        :-moz-placeholder {
            font-size: .346667rem;
            color: #d4d4d4;
        }

        ::-moz-placeholder {
            font-size: .346667rem;
            color: #d4d4d4;
        }

        input:-ms-input-placeholder {
            font-size: .346667rem;
            color: #d4d4d4;
        }

        input::-ms-input-placeholder {
            font-size: .346667rem;
            color: #d4d4d4;
        }

        .weui-picker-modal .picker-item {
            font-size: 0.7rem !important;
        }
        .toolbar .picker-button {
            padding: 0rem 0.1rem !important;
        }
    </style>
</head>

<body>
    <div class="container11">
        <img src="./images/28.png" alt="" class="img19">
        <div class="content">
            <div class="input">
                <div>
                    <div class="require">*</div>
                    <div>姓名:</div>
                </div>
                <input type="text">
            </div>
            <div class="input">
                <div>
                    <div class="require">*</div>
                    <div>性别:</div>
                </div>
                <input type="text" class="sex">
                <img src="./images/13.png" alt="" class="img13">
            </div>
            <div class="input">
                <div>
                    <div class="require">*</div>
                    <div>学历:</div>
                </div>
                <input type="text" class="record">
                <img src="./images/13.png" alt="" class="img13">
            </div>
            <div class="input">
                <div>
                    <div class="require">*</div>
                    <div>专业:</div>
                </div>
                <input type="text">
            </div>
            <div class="input">
                <div>
                    <div class="require">*</div>
                    <div>毕业院校:</div>
                </div>
                <input type="text">
            </div>
            <div class="input">
                <div>
                    <div class="require">*</div>
                    <div>毕业年份:</div>
                </div>
                <input type="text" class="year">
                <img src="./images/13.png" alt="" class="img13">
            </div>
            <div class="input">
                <div>
                    <div class="require">*</div>
                    <div>联系方式:</div>
                </div>
                <input type="text">
            </div>
            <div class="input">
                <div>
                    <div class="require">*</div>
                    <div>户籍所在地：</div>
                </div>
                <input type="text">
            </div>
            <div class="input">
                <div>
                    <div class="require">*</div>
                    <div>兼职经历:</div>
                </div>
                <input type="text" class="part-time-job">
                <img src="./images/13.png" alt="" class="img13">
            </div>
            <div class="input">
                <div>
                    <div class="require">*</div>
                    <div>从事销售行业的经历:</div>
                </div>
                <input type="text" class="sale-job">
                <img src="./images/13.png" alt="" class="img13">
            </div>
            <div class="input">
                <div>
                    <div class="require">*</div>
                    <div>户外摆摊的经历:</div>
                </div>
                <input type="text" class="outdoor-stalls">
                <img src="./images/13.png" alt="" class="img13">
            </div>
            <div class="input">
                <div>
                    <div class="require">*</div>
                    <div>家中是否有从事销售行业的相关人员:</div>
                </div>
                <input type="text" class="home-sale">
                <img src="./images/13.png" alt="" class="img13">
            </div>
            <div class="section">
                <div class="input input1">
                    <div>
                        <div class="require">*</div>
                        <div>拟开店地址：</div>
                    </div>
                    <input class="weui-input" id="start" type="text" value="武汉市 江岸区 大智街道">
                </div>
                <textarea name="" id="" style="resize:none;width: 7.466667rem;height: 2.04rem;font-size: 0.4rem;resize:none;
                background-color: #ffffff;border-radius: 10px;border: solid 1px #a1a1a1;" placeholder="详细街道地址"
                    @blur.prevent="inputLoseFocus"></textarea>
            </div>
            <div class="textarea">
                <div>
                    <div class="require">*</div>
                    <div>申报理由:</div>
                </div>
                <textarea name="" id="" style="resize:none;font-size: 0.4rem;"></textarea>
            </div>
            <div class="btns">
                <button class="submit"></button>
                <a href="" style="margin-top: -0.3rem;"><img src="./images/09.png" alt="" class="img09"></a>
            </div>
        </div>
    </div>
    <!-- 提交成功弹窗 -->
    <div class="popup" style="display: none;">
        <div class="content">
            <div class="title">信息已成功提交，感谢您的积极参与！</div>
            <div class="tips">如通过遴选，会有湖北体彩的工作人员电话与您联系，请保持手机畅通。<span>（我们会对您的个人资料严格保密，妥善保管。所有信息仅供本次活动使用。）</span></div>
            <!-- 删除按钮 -->
            <img src="./images/26.png" alt="" class="img26">
        </div>
    </div>
</body>
<!-- body 最后 -->
<script src="./js/jquery-weui.js"></script>
<script src="./js/jquery-weui.min.js"></script>
<!-- 如果使用了某些拓展插件还需要额外的JS -->
<script src="./js/swiper.min.js"></script>
<script src="./js/city-picker.js"></script>
<script>
    $(".year").select({
        title: "选择毕业年份",
        items: ["2024", "2023", "2022", "2021", "2020", "2019", "2018"]
    });
    $(".sex").select({
        title: "选择性别",
        items: ["男", "女"]
    });
    $(".record").select({
        title: "选择学历",
        items: ["博士生", "研究生", "本科", "大专", "中专","其它"]
    });
    $(".part-time-job").select({
        title: "选择是否有过兼职经历",
        items: ["是", "否"]
    });
    $(".sale-job").select({
        title: "是否有从事销售行业的经历",
        items: ["是", "否"]
    });
    $(".outdoor-stalls").select({
        title: "是否有户外摆摊的经历",
        items: ["是", "否"]
    });
    $(".home-sale").select({
        title: "家中是否有从事销售类型行业的相关人员",
        items: ["是", "否"]
    });
    $("#start").cityPicker({
        title: "选择地址",
        onChange: function (picker, values, displayValues) {
            console.log(values, displayValues);
        }
    })
    $('body').on('touchend', function (el) {
        if (el.target.tagName != 'INPUT') {
            $('input').blur()
        }
        if (el.target.tagName != 'TEXTAREA') {
            $('TEXTAREA').blur()
        }
    })
    $("textarea").blur(function () {
        $('.container11 .content').css("padding-bottom","0.933333rem")
    })
</script>

</html>